import React from 'react';
import Taro from '@tarojs/taro';

import {connect} from 'react-redux';
import * as T from './types';
import actions from './actions';
import {store2Props} from './selectors';
import config from '@/service/config';
import {WMkit} from 'wmkit';
import {GAME_SHARE_TITLE, OSS_BASE_PATH_PREFIX, TASK_CONDITION_TYPE, GOLD_SELECT_TASK} from './constant';

import {View, WebView} from '@tarojs/components';
import './index.less';

actions().actions.loadReducer();

// @ts-ignore
@connect<Partial<T.IProps>, any>(store2Props, actions)
export default class ReceiveGoldCoinsPa extends React.Component<Partial<T.IProps>, any> {
  //使用state值
  constructor(props) {
    super(props);
    this.state = {
      query: {},
      pics: {
        gameShareIcon: OSS_BASE_PATH_PREFIX + '/gameShareIcon.png', // 分享至朋友圈
        gameShareThum: OSS_BASE_PATH_PREFIX + '/gameShareThum.png', // 分享缩略图
      },
    };
  }

  componentDidShow() {
    this.handleGetRouterParams(); // 获取路由参数
    this.props.actions.init();
  }

  /**
   * 获取路由参数
   */
  handleGetRouterParams = () => {
    let params = Taro.getCurrentInstance()?.router?.params;

    this.setState({
      query: params,
    });
    console.log('receiveGold index handleGetRouterParams params', params);
    // 收藏进来的就直接去首页
    if (params.favorite) {
      Taro.redirectTo({
        url: '/pages/package-I/home/index',
      });
      return;
    }
  };

  componentWillUnmount() {
    this.props.actions.clean();
  }

  render() {
    if (!this.props.main) return null;
    let {
      main: {isLoading},
    } = this.props;
    console.log(isLoading);
    const {query} = this.state;

    let token = Taro.getStorageSync('authInfo:token'); // 获取token
    let host = WMkit.prefixUrl(config.host); // 获取host
    let webViewUrl = WMkit.prefixUrl(config.goldCoinHost);

    console.log('index.tsx token', token, 'host', host);

    let url = webViewUrl + '?t=' + token + '&h=' + host;
    if (query && query.propEffect && query.propId) {
      url = url + '&propEffect=' + query.propEffect + '&propId=' + query.propId;
    }
    //如果有任务的话
    let selectTask = Taro.getStorageSync(GOLD_SELECT_TASK);
    if (selectTask && selectTask.taskId && selectTask.taskConditionsType == TASK_CONDITION_TYPE['game']) {
      url = url + '&taskId=' + selectTask.taskId + '&taskConditionsType=' + selectTask.taskConditionsType;
    }

    console.log('index.tsx this.query', this.state.query);
    console.log('index.tsx render host', host);
    console.log('index.tsx render url', url);
    return (
      <View className="pageReceiveGoldCoinsPa" catchMove>
        <WebView src={url} onMessage={this.onWebMessage} />
      </View>
    );
  }

  onWebMessage = () => {
    Taro.removeStorageSync(GOLD_SELECT_TASK); // 删除缓存
  };

  /**
   * 收藏
   * @param res
   * @returns
   */
  onAddToFavorites(res) {
    const {
      pics: {gameShareIcon},
    } = this.state;

    if (res.from === 'button') {
      // 来自页面内转发按钮
      console.log(res.target);
    }
    return {
      title: GAME_SHARE_TITLE,
      imageUrl: gameShareIcon,
      query: 'favorite=true',
    };
  }
}
